<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <meta content="telephone=no" name="format-detection" />
    <title>团购详情</title>
    <link href="{{ static('css/main.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ static('css/style.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ static('css/shake.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ static('css/font-awesome.min.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ static('css/animate.min.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ static('css/idangerous.swiper.css') }}" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="{{ static('js/jquery-1.8.3.min.js') }}"></script>
    <script type="text/javascript" src="{{ static('js/jquery.form.min.js') }}"></script>
    <script type="text/javascript" src="{{ static('js/jquery.form.js') }}"></script>
    <script type="text/javascript" src="{{ static('js/wo.js') }}"></script>
</head>
<body>
<div class="warpe">
    <div class="reveal-modal-bg dis_none"></div>
    <div class="navcenter dis_none">
        <ul>
            <li class="animated fadeInLeft margin_left">
                <a href="report.html">
                    <span><img src="{{ static('img/icon_jb.png') }}"></span>
                    <p>举报</p>
                </a>
            </li>
            <li class="animated fadeInRight">
                <a href="#">
                    <span><img src="{{ static('img/icon_bj.png') }}"></span>
                    <p>编辑</p>
                </a>
            </li>
            <li class="animated fadeInLeft">
                <a href="#" class="closed">
                    <span><img src="{{ static('img/icon_gb.png') }}"></span>
                    <p>关闭</p>
                </a>
            </li>
            <li class="animated fadeInRight">
                <a href="#">
                    <span><img src="{{ static('img/icon_list.png') }}"></span>
                    <p>列表</p>
                </a>
            </li>
        </ul>
    </div>
    <div class="head">
        <a href="#" class="return"><i class="icon-chevron-left"></i> 返回</a>
        团购详情
        <a href="#" class="search navbtn"><i class=" icon-cog"></i> </a>
    </div>
    <div class="main">
        <div class="postall margin_top clear_border">
            <a href="#">
                <div class="post_t">
                    <img src="{{ static('img/banner.jpg') }}">
                    <span>{{ user.username }}</span>
                </div>
                <div class="post_m">
                    <p>{{ shop.info }}</p>
                    <p><span class="puff_left color_y">最少参团人数：{{ shop.count_least }}人</span> <span class="puff_right color_y">￥{{ shop.price }}</span> </p>
                </div>
                <div class="post_img post_img02 animated bounceIn">
                    <img src="{{ shop.image_urls }}">
                </div>
                <div class="group_txt">
                    <p><label>团购须知</label> <i class="icon-volume-down color_y"></i></p>
                    <p class="animated fadeInRight"><label class="color_g">截止日期：</label><span>{{ shop.end_time }}</span></p>
                    <p class="animated fadeInLeft"><label class="color_g">到货日期：</label><span>{{ shop.receive_time }}</span></p>
                    <p class="animated fadeInRight"><label class="color_g">成团份数：</label><span>{{ shop.count_least }}份起-{{ shop.count_max }}份止</span></p>
                    <p class="animated fadeInLeft"><label class="color_g">份数说明：</label><span>巴拉巴拉小魔仙</span></p>
                    <p class="animated fadeInRight"><label class="color_g">取货地点：</label><span>{{ shop.place }}</span></p>
                </div>
                <div class="post_b">
                    <span class="puff_left">{{ shop.create_time }}</span>
                </div>
            </a>
        </div>
    </div>
    <div class="main" style="margin-top: 1rem;">
        <div class="postall">
            <div class="post_t post_t2">
                <span class=" icon-group"></span>
                <span>5人</span>
               <span class="puff_right"> <a href="group_participate.html" class=" icon-bookmark-empty color_y"><font style="font-size: 1.2rem">参团</font> </a></span>
            </div>
            <div class="post_m">
                <p class="color_g animated fadeInRight">龙秋顺（3）、陈新伟（2）、黄春权、曾春鹏、诠谁</p>
            </div>
        </div>
        <div class="postall">
            {% for comment in comments %}
                <div class="post_t">
                    <img src="{{ static('img/banner.jpg') }}">
                    <span>{{ comment.user.username }}</span>
                    <label class="puff_right">{{ comment.create_time }}</label>
                </div>
                <div class="post_m">
                    <p class="animated fadeInRight">{{ comment.content }}</p>
                    <span class="span_delete animated fadeInDown"><a href="#">删除</a> </span>
                </div>
            {% endfor %}
        </div>
    </div>

</div>
<div class="postinput">
    <form action="#" id="comments">
        <div class="textarea_input">
            <input type="text" placeholder="说些什么" name="comment">
        </div>
        <a href="#"><img src="{{ static('img/icon_bq.png') }}"></a>
        <div class="tool_submit tr">
            <button type="submit" name="" value="" class="button sublist">留 言</button>
        </div>
{#        <a href="#"><i class="icon-share-alt"></i> </a>#}
    </form>
</div>
<script type="text/javascript">
    $('#comments').submit(function (e) {
        e.preventDefault();
        $(this).ajaxSubmit({
            url: '/comments/{{ shop.id }}/',
            type: 'POST',
            success: function (data) {
                if (data.errno == '0') {
                    // 评论成功
                    alert(data.errmsg)
                } else {
                    //评论失败
                    alert(data.errmsg)
                }
            }
        })
    })
</script>
</body>
</html>